<!-- /index  /about 周边数据界面展示 -->
<template>
  <div class="home">
    <topBar title="智慧集约化驾驶舱系统" :show="true" @changeRange="changeRange" v-if="!isFullScreen" />
    <!-- 正常展示 -->
    <div class="wrap" v-if="!isFullScreen">
      <div class="top">
        <div class="left">
          <div class="progress">
            <div class="progress-left">
              <p class="progress-t">总库容</p>
              <p class="progress-num">
                <span
                  v-for="(res, idx) in formatterZero(totalNum, 6)"
                  :key="idx"
                  >{{ res }}</span
                >
              </p>
            </div>
            <div class="progress-right">
              <p class="progress-t">库容余量</p>
              <p class="progress-num">
                <span
                  v-for="(res, i) in formatterZero(restNum, 6)"
                  :key="i"
                  >{{ res }}</span
                >
              </p>
            </div>
          </div>
          <div class="pie">
            <h1 class="lineTitle">档案状态</h1>
            <!-- <div id="main1" :style="sy3"></div> -->
            <!-- <ShelvesCharts ref="chartShelves" :key="timer" :styleItem="sy1" :Totalarchives="Totalarchives" :xData="currentDate2" :data1="data1" /> -->
            <div class="pie-content">
              <BoxStatusCharts
                ref="BoxStatusCharts"
                :key="timer"
                :styleItem="sy3"
                :boxStatusData="boxStatusData"
                :boxTotal="boxTotal"
              />
            </div>
          </div>
          <div class="pie2">
            <h1 class="lineTitle">档案上收情况</h1>
            <CollectionCharts
              ref="CollectionCharts"
              :key="timer"
              :styleItem="sy1"
              :yAxisData="yAxisData"

              :collect_series="collect_series"
              :collectionData="collectionData"
            />
          </div>
        </div>
        <!-- 中间的地图 -->
        <div class="flexWidth">
          <!-- <mapChart997
            v-if="depotId == 997 && !enclosureMapShow"
            :depotId="depotId"
            @changeData="changeData"
          /> -->
          <mapChart
            v-if="!enclosureMapShow"
            :depotId="depotId"
            @fullScreen="fullScreen"
            :depotList="depotList"
            
            @changeData="changeData"
          />
          <div v-if="enclosureMapShow" class="enclosure-map-box">
            <EnclosureMapBox ref="enclosureMapBox" :depotId="depotId" :depotName="depotName" :depotCode="depotCode" @goBack="goBack" @fullScreen="fullScreen" />
          </div>
          
        </div>
        <div class="right">

          <!-- <div class="text-container">
            <p class="text2-t">预警提示</p>
            <vue-seamless-scroll ref="alarmInfoArrS" :data="alarmInfoList"
            :class-option="optionHoverAlarm" class="seamless-warp-line">
              <p class="text2 scroll-left" v-for="(alarm, index) in alarmInfoList"
              :key="index">
                <i class="iconfont icon-ai43 red"></i>
                <span v-text="alarm.alarmInfo" v-show="alarm.alarmInfo == '暂无'"></span>
                <vue-seamless-scroll v-show="alarm.alarmInfo != '暂无'" ref="alarmInfoIndex" :data="[alarm.alarmInfo]" :key="index"
                 :class-option="optionHoverLeft" class="seamless-warp-left">
                <span v-text="alarm.alarmInfo"></span>
                </vue-seamless-scroll>
              </p>
            </vue-seamless-scroll>
          </div> -->

          <div class="warning list">
            <p class="ordesc tit lineTitle">预警情况</p>
            <!-- <div>
              <li class="wrapBoxTitle">
                <div  class="type">告警时间</div>
                <div>告警信息</div>
              </li>
            </div> -->
            <div id="box">
              <vue-seamless-scroll ref="borrowList" :data="alarmInfoList" :class-option="optionHover" class="seamless-warp">
                <ul class="item">
                  <li v-for="(item, index) in alarmInfoList" :key="index" class="wrapBoxFlex">
                    <div class="type">  {{ item.alarmTime }} </div>
                    <div class="scrolling-text">
                      <span>{{ item.alarmInfo }}</span>
                      <i class="iconfont icon-ai43"></i>
                    </div>
                    <!-- <span>{{ parseTime(item.scanBoxTime * 1000) }}</span> -->
                    <!-- <span>{{ item.rackCode }}</span> -->
                  </li>
                </ul>
              </vue-seamless-scroll>
            </div>
          </div>



          <div class="warning pandian">
            <!-- <h1 class="lineTitle">盘点情况</h1> -->
            <!-- <div id="checkCondition" ref="bar" :style="sy1"></div> -->
            <!-- 引入盘点图表 -->
            <!-- <InventoryCharts
              ref="InventoryCharts"
              :key="timer"
              :styleItem="sy1"
              :currentDate="currentDate"
              :checkSerires="checkSerires"
              :scanData="scanData"
            /> -->

            <!-- 饼图 - 假的盘点数据 -->
            <div class="pandian-content">
            <VirtualPandian
              ref="InventoryCharts"
              :key="timer"
              :styleItem="sy3"
              :boxStatusData="boxStatusData"
              :totalNum="totalNum"
              :restNum="restNum"
              :danganTotal="danganTotal"
              :depotId="depotId"
            />
          </div>
          </div>
        </div>
      </div>

      <!-- <chartsLine /> -->

      <!-- <ShelvesCharts id="chartShelves" :Totalarchives="Totalarchives" :xData="currentDate2" :data1="data1" /> -->
      <!-- 下面的3个图 -->
      <el-row class="bottom">
        <el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
          <div class="bottomBox chartH" style="width: 98%;">
            <h1 class="lineTitle">上/下架趋势</h1>
            <ShelvesCharts
              ref="chartShelves"
              :key="timer"
              :styleItem="sy1"
              :Totalarchives="Totalarchives"
              :xData="currentDate2"
              :data1="data1"
              :shelvesData="shelvesData"
            />

            <!-- <div id="chartShelves" :style="sy1"></div> -->
          </div>
        </el-col>
        <el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
          <div class="bottomBox chartH" style="width: 98%;">
            <h1 class="lineTitle">进/出库趋势</h1>
            <!-- <div id="chartLineBox" :style="sy1"></div> -->
            <InOutBoundCharts
              ref="InOutBoundCharts"
              :key="timer"
              :styleItem="sy1"
              :Totalarchives="Totalarchives"
              :xData="currentDate2"
              :data1="data1"
              :inOutDepotData="inOutDepotData"
            />
          </div>
        </el-col>
        <el-col :xs="8" :sm="8" :md="8" :lg="8" :xl="8">
          <div class="bottomBox chartH bottomR" style="width: 98%;">
            <h1 class="lineTitle">调阅总量</h1>
            <!-- <div class="tabs">
              <div
                :class="activeName == 1 ? 'isActive' : ''"
                class="tabsitem"
                @click="tabClick(1)"
              >
                本月
              </div>
              <div
                :class="activeName == 2 ? 'isActive' : ''"
                class="tabsitem"
                @click="tabClick(2)"
              >
                年度
              </div>
            </div>
            <div v-if="activeName == 1" id="myChart2" :style="sy2"></div>
            <div v-if="activeName == 2" id="detailsChart" :style="sy2"></div> -->
            <AccessCharts
              ref="AccessCharts"
              :key="timer"
              :styleItem="sy2"
              :allCatData="allCatData"
              :currentDate3="currentDate3"
              :accessDataDetails_time="accessDataDetails_time"
              :serises_data="serises_data"
              :borrowTotalData="borrowTotalData"
            />

            <!-- <div id="detailsChart" :style="sy2"></div> -->
            <!-- <el-tabs tab-position="top" :style="sy2" @tab-click="tabClick">
              <el-tab-pane labechartShelvesl="调阅">
                <div class="Chart2" v-if="activeName == 0">
                  <div id="myChart2" :style="sy2"></div>
                </div>
              </el-tab-pane>
              <el-tab-pane label="明细">
                <div id="detailsChart" :style="sy2"></div>
              </el-tab-pane>
            </el-tabs>-->
          </div>
        </el-col>
      </el-row>
    </div>

    <!-- 放大之后的展示 -->
    <div class="wrap-full-creen wrap" v-if="isFullScreen">
      <div class="close" title="退出全屏" @click="exitFullScreen"> 
        <!-- <i class="icon-close iconfont"></i> -->
        <img src="@/assets/map-icon/close.svg" alt="">
      </div>

      <mapChart
        v-if="!enclosureMapShow"
        :depotId="depotId"
        @fullScreen="fullScreen"
        :isFullScreen="isFullScreen"

        @changeData="changeData"
      />

      <div v-if="enclosureMapShow" class="enclosure-map-box enclosure-map-big-box">
        <EnclosureMapBox ref="enclosureMapBox" :depotId="depotId" :depotName="depotName" :depotCode="depotCode" @goBack="goBack" @fullScreen="fullScreen" :isFullScreen="isFullScreen" />
        <!-- 告警列表 -->
        <div class="warning list alarm-box">
          <p class="ordesc tit lineTitle">预警情况</p>
          <!-- <div>
            <li class="wrapBoxTitle">
              <div  class="type">告警时间</div>
              <div>告警信息</div>
            </li>
          </div> -->
          <div id="box">
            <!-- <vue-seamless-scroll ref="borrowList" :data="alarmInfoList" :class-option="optionHover" class="seamless-warp"> -->
              <ul class="item">
                <li v-for="(item, index) in alarmInfoList" :key="index" class="wrapBoxFlex">
                  <div class="type">  {{ item.alarmTime }} </div>
                  <div class="scrolling-text">
                    <span>{{ item.alarmInfo }}</span>
                    <i class="iconfont icon-ai43"></i>
                  </div>
                </li>
              </ul>
            <!-- </vue-seamless-scroll> -->
          </div>
        </div>
       
      </div>
    </div>
  </div>
</template>

<script>
import './index.scss';
import {getDepotList, getDepotStatistics, getDepotRegionalStatistics, getAlarmInfo } from "@/api/mapPoint/points";
import EnclosureMapBox from "@/components/mapBox.vue";
import { getLabel, parseTime } from "@/utils/utils";
import {orderSubTypeList} from "@/utils/dictionary"
import BoxStatusCharts from "./components/BoxStatusCharts.vue";
import ShelvesCharts from "./components/ShelvesCharts.vue";
import InOutBoundCharts from "./components/InOutBoundCharts.vue";
import AccessCharts from "./components/AccessCharts.vue";
// import chartsLine from "./components/chartsLine.vue";
import InventoryCharts from "./components/InventoryCharts.vue";
import CollectionCharts from "./components/CollectionCharts.vue";

import VirtualPandian from "./components/VirtualPandian.vue";

// @ is an alias to /src
import $ from "jquery";
import topBar from "@/components/topBar.vue";
import mapChart from "@/components/mapChart.vue";
// import mapChart997 from "@/components/mapChart997.vue";

let echarts = require("echarts/lib/echarts");
// 引入饼状图组件
require("echarts/lib/chart/pie");
// 引入提示框和title组件
require("echarts/lib/component/tooltip");
require("echarts/lib/component/title");
import { baseEnv } from "@/request";

const APIURL = require("../../public/ipConfigtest");
const totalDuration = 3000;
let baseUrl;
let myChart2;
let myChart3;
let collectionMap;
let myChartpie;
// let legenddata = [];
// let valuedata = [];


let collect_series = [];
let serises_data = [];
let accessDataDetails_time = [];
let pieAllData = [];
export default {
  name: "Home",
  components: {
    EnclosureMapBox,
    mapChart,
    // mapChart997,
    topBar,
    BoxStatusCharts,
    ShelvesCharts,
    InOutBoundCharts,
    AccessCharts,
    // chartsLine,
    InventoryCharts,
    CollectionCharts,
    VirtualPandian,
    
  },
  data() {
    return {
      depotList: [],
      enclosureMapShow: false,
      isFullScreen: false,
      getLabel: getLabel,
      parseTime:parseTime,
      orderSubTypeList: orderSubTypeList,
      timer: "", // 时间搓
      arrNum: [0, 1],
      sy1: {},
      sy2: {},
      sy3: {},
      activeName: 1,
      data1: [],
      Totalarchives: [],
      allData: [],
      allCatData: [],
      checkLegend: [],
      checkSerires: [],
      currentDate: [],
      currentDate2: [],
      currentDate3: [],
      animate: true,
      items: [
        //消息列表对应的数组
        { num: "Q01GYQV34L", date: "2022-09-26 14:02:15" },
        { num: "Q01GYQV33L", date: "2022-09-26 15:35:45" },
        { num: "Q01GYQV37L", date: "2022-09-26 17:10:09" },
        { num: "Q01GYQV13L", date: "2022-09-26 18:30:16" },
      ],
      borrowRecordList: [
        // //消息列表对应的数组
        // // { num: "区域", date: "时间", reson: "详情" },
        // { num: "Q01GYQV16L", date: "2022-09-26 14:02:15", reson: "财务审计" },
        // { num: "Q01GYQV13L", date: "2022-09-26 14:02:15", reson: "财务审计" },
        // { num: "Q01GYQV83L", date: "2022-09-26 15:35:45", reson: "领导检查" },
        // { num: "Q01GYQV88L", date: "2022-09-26 17:10:09", reson: "领导检查" },
        // { num: "Q01GYQV09L", date: "2022-09-26 18:30:16", reson: "领导检查" },
      ],

      depotId: null,
      depotName: null,
      depotCode: '',
      timeType: 1, // 默认近一周
      regionalCode: null,


      totalNum: 0,
      restNum: 0,
      danganTotal: 0,
      boxTotal: 0,
      boxStatusData: [],
      collectionData: [],
      shelvesData: [],
      inOutDepotData: [],
      borrowTotalData: [],
      scanData: [],
      scanBoxList: [],

      alarmInfoArr: [],
      alarmInfoList: [],

      alarmInterval: null,
      allPageInterval: null,



      addNum: "2120",
      destrucNum: 1200,
      preDestrucNum: 821,
      number: 0,

      accessDataDetails_time: [],
      serises_data: [],

      collect_series: [],
      yAxisData: [],
    };
  },
  computed: {
    optionHoverLeft() {
      return {
        // hoverStop: false, //鼠标悬停关闭
        // // singleWidth: 0, // 单行停顿的宽度(默认值0是无缝不停止的滚动)  
        // singleHeight: 56,//单行停顿间距(不需要停顿不设置)
        waitTime: 50000,//单行停顿时间(不需要停顿不设置)
        step: 0.1,//向上滚动不停顿
        limitMoveNum: 1, // 开始无缝滚动的数据量 
        direction: 2, // 0向下 1向上 2向左 3向右
        openWatch: true, // 开启数据实时监控刷新dom
      }
    },
    optionHoverAlarm() {
      return {
        // hoverStop: false, //鼠标悬停关闭
        // singleWidth: 0, // 单行停顿的宽度(默认值0是无缝不停止的滚动)  
        singleHeight: 56,//单行停顿间距(不需要停顿不设置)
        waitTime: 10000,//单行停顿时间(不需要停顿不设置)
        step: 0.8,//向上滚动不停顿
        limitMoveNum: 2, // 开始无缝滚动的数据量 
        direction: 1, // 0向下 1向上 2向左 3向右
        openWatch: true, // 开启数据实时监控刷新dom
      }
    },
    optionHover () {
      return {
        // hoverStop: true, //鼠标悬停关闭
        // singleWidth: 0, // 单行停顿的宽度(默认值0是无缝不停止的滚动)  
        // singleHeight: 60,//单行停顿间距(不需要停顿不设置)
        // waitTime: 2500,//单行停顿时间(不需要停顿不设置)
        step: 0.5,//向上滚动不停顿
        limitMoveNum: 3, // 开始无缝滚动的数据量 
        direction: 1, // 0向下 1向上 2向左 3向右
        openWatch: true, // 开启数据实时监控刷新dom
        // singleHeight: 30,
      }
    },

    text() {
      // 展示的文本内容（滚动）
      // console.log("文本", this.number);
      return {
        id: this.number,
        val: this.alarmInfoArr[this.number]
        // .replace(
        //   /\[.*\]/g,
        //   `<span style="color:rgba(252, 166, 51, 1)">${
        //     this.alarmInfoArr[this.number].match(/\[.*\]/g)[0]
        //   }</span>`
        // ),
      };
    },
  },
  watch: {
    $route(to, from) {
      console.log(to, 'to')
      console.log(from, 'from')
      // if (to.path === '/about') {
      //   this.enclosureMapShow = true
      //   return 
      // } else {
      //   this.enclosureMapShow = false
      // }
      // this.depotId = to.query.depotId
      // this.depotName = to.query.depotName
    }
    // let arrlen = len - num.length;
    // this.arrNum = new Array(2);
    // for (let i = 0; i < arrlen.length; i++) {
    //  console.log(i);
    // }
  },
  beforeMount() {
    // 引入不同的界面（地图/室内定位）
    // /about 展示室内定位  index 展示地图
    if (this.$route.path === '/about') {
      this.enclosureMapShow = true
      return 
    } else {
      this.enclosureMapShow = false
    }


    console.log(this.$route.path, '=====返回的时候 --- this.$route.path')
  },
  created() {
    this.depotId = this.$route.query.depotId || null
    // 根据depotId 获取对应的depotName和 depotCode
    getDepotList({}).then(res => {
      this.depotList = res.data
      if (this.$route.path === '/about') {
        this.depotList.map(item => {
          if (item.id == this.depotId) {
            this.depotCode = item.code
            this.depotName = item.name
            this.$forceUpdate()
          }
        })
      }
    })

    // this.depotName = this.$route.query.depotName
    // this.depotCode = this.$route.query.depotCode

    console.log(this.$route.path, '111返回的时候 --- this.$route.path')
  },
  mounted() {
    console.log(this.$route, '返回的时候 --- this.$route.path')
    // 获得地址中的depotId
    this.depotId = this.$route.query.depotId || null
    // this.depotName = this.$route.query.depotName
    // this.depotCode = this.$route.query.depotCode

    this.getWCCStatus(this.depotId, this.timeType)
    this.getAlarm(this.depotId)

    // 页面定时器
    this.allPageInterval = setInterval(() => {
      this.getWCCStatus(this.depotId, this.timeType)
    }, 10*60*1000)
    this.alarmInterval = setInterval(() => {
      this.getAlarm(this.depotId)
    }, 10*1000)

    if (baseEnv == "development") {
      baseUrl = "/api";
    } else {
      baseUrl = "http://services.kaiqiaole.com/AIM";
    }
    
    if (window.outerWidth <= 768) {
      this.sy1 = {
        width: "100%",
        height: "5.8rem",
      };
      this.sy2 = {
        width: "100%",
        height: "5.6rem",
      };
      this.sy3 = {
        width: "100%",
        height: "4.3rem",
      };
    } else {
      this.sy1 = {
        width: "100%",
        height: "calc(100% - 0.4rem)",
      };
      this.sy2 = {
        width: "100%",
        height: "calc(100% - 0.4rem)",
      };
      this.sy3 = {
        width: "100%",
        height: "80%",
      };
    }
  },
  // mounted() {
  //   // $.getJSON(`${baseUrl}/allData.json`, (data) => {
  //   //
  //   // });
  //   // this.timer1 = setInterval(this.scroll, 2000);
  //   this.timer2 = setInterval(this.scroll2, 3000);
  // },
  // 组件销毁
  destroyed() {
    // clearInterval(this.timer1);
    clearInterval(this.timer2);
    clearInterval(this.alarmInterval)
    clearInterval(this.allPageInterval)
  },
  methods: {
    // changeRange
    changeRange(rangeType) {
      console.log(rangeType, 'oooo')
      this.timeType = rangeType
      this.getWCCStatus(this.depotId, this.timeType)
    },
    // 地图/室内定位全屏
    fullScreen(value) {
      this.isFullScreen = value;
      if (!this.isFullScreen) {
        this.regionalCode = '000000'
        this.getWCCStatus(this.depotId, this.timeType)
      }
    },
    exitFullScreen() {
      this.isFullScreen = false;
      this.regionalCode = '000000'
      this.getWCCStatus(this.depotId, this.timeType)
    },
    // 返回 -- 由室内地图到全国地图
    goBack() {
      this.enclosureMapShow = false
      this.$router.push({
        path: "/",
        query: {
          // depotId: this.depotId,
        },
      });
      // 重新请求数据
      setTimeout(() => {
        this.regionalCode = '000000'
        this.getWCCStatus(this.depotId, this.timeType)
      }, 500)
      
    },
    getDepotList() {
      getDepotList({}).then(res => {
        console.log(res, 'getDepotListgetDepotList')
        this.depotList = res.data
      })
    },
    // 获得预警提示
    getAlarm(depotId) {
      console.log('ppppppppppppppppgetAlarmgetAlarm')
      this.alarmInfoArr = []
      // this.alarmInfoList = []
      let params = {}
      if (this.$route.path === '/about') {
        params = {depotId: depotId}
      } else {
        params = {}
      }
      getAlarmInfo(params).then(res => {
        this.alarmInfoList = []
        this.alarmInfoList = res.data.filter(m => m.alarmInfo != null)
        if (!this.isFullScreen) this.$refs.borrowList.reset()

        // this.alarmInfoList = [{deviceId: null, deviceType: 0, alarmInfo: "标签MD：419747 触发电子进围栏报警, 围栏名：消贷一级档案, 时间：2023-02-14 10:01:01",alarmTime:1676340061076},
        // {deviceId: null, deviceType: 0, alarmInfo: "标签CC：419747 触发电子进围栏报警, 围栏名：消贷一级档案, 时间：2023-02-14 10:01:01",alarmTime:1676340061076}]
        
        // if(this.alarmInfoList.length === 0) {
        //   this.alarmInfoArr = ['暂无']
        //   this.alarmInfoList = [{alarmInfo: '暂无'}]
        // } else {
          // this.alarmInfoList.map(m => {
          //   this.alarmInfoArr.push(m.alarmInfo)
          // })
        // }
      
      })
    },
    // 获得wcc数据
    getWCCStatus(depotId, type, regionalCode) {
      console.log('xxxxxxxxxgetWCCStatusgetWCCStatus', this.$route.path)
      let that = this
      let requestApi
      let params
      // 情况下使用 1、切换时间范围  2、地图模式时切换省市 3、循环 4、刚进入
     if (this.$route.path === '/about') {
      requestApi = getDepotStatistics
      params = {
        depotId: depotId,
        type: type,
      }
     } else if (this.$route.path === '/index') {
      requestApi = getDepotRegionalStatistics
      params = {
        // depotId: depotId,
        regionalCode: this.regionalCode || '000000',
        type: type,
      }
     }

     requestApi(params).then(res => {
      console.log('resres---44444', res,res.data, 'resres')
      // let baseUrl = "/api";
      // this.axios.get(`${baseUrl}/depot/wcc/statistics?depotId=${depotId}&type=${type}`).then(res => {
        console.log('resres---', res, res.data.surplus, 'resres')

        const statisticsWCC = res.data || {}
        if (!statisticsWCC) return
        this.totalNum = statisticsWCC.total
        this.restNum = statisticsWCC.surplus
        this.danganTotal = statisticsWCC.danganTotal // id是100000时使用

        this.boxTotal = statisticsWCC.boxTotal
        this.boxStatusData = [
            {
              name: "正常存储",
              value: statisticsWCC.normalStatusTotal,
            },
            {
              name: "调阅中",
              value: statisticsWCC.borrowStatusTotal,
            },
            {
              name: "销毁中",
              value: statisticsWCC.destroyStatusTotal,
            },
            {
              name: "上收中",
              value: statisticsWCC.collectingStatusTotal,
            },
          ]
        this.collectionData = statisticsWCC.archiveList || []
        this.borrowRecordList = statisticsWCC.borrowRecordList || []
        this.scanBoxList = statisticsWCC.scanBoxList || []
        this.scanData = statisticsWCC.scanList || []

        this.shelvesData = statisticsWCC.putAndOutShelfList
        this.inOutDepotData = statisticsWCC.inAndOutDepotList
        this.borrowTotalData = statisticsWCC.borrowTotalList

        // this.mLeave()
        // this.startMove();

        setTimeout(() => {
          this.$refs.BoxStatusCharts.reloadChart();
          this.$refs.CollectionCharts.reloadChart()
          this.$refs.InventoryCharts.reloadChart();

          this.$refs.chartShelves.reloadChart();
          this.$refs.InOutBoundCharts.reloadChart();
          this.$refs.AccessCharts.reloadChart();
        }, 0);

      
      })
    },
    // 总量 及 库余展示
    formatterZero(num, len = 6) {
      if (String(num).length > len) return String(num);
      return (Array(len).join(0) + num).slice(-len);
    },
    changeData(data) {
      console.log(data, 'ppp')
      this.regionalCode = data
      this.getWCCStatus(this.depotId, this.timeType, this.regionalCode)


      // console.log("最近三天", data);
      // this.currentDate = data;
      // this.currentDate2 = data;
      // this.currentDate3 = data;

      // // this.checkCondition();
      // this.$refs.InventoryCharts.reloadChart();
      // // this.totalArch();
      // this.$refs.InOutBoundCharts.reloadChart();
      // // this.drawLine();
      // this.$refs.AccessCharts.reloadChart();
    },

    // 右侧滚动
    scroll() {
      let con1 = this.$refs.con1;
      con1.style.marginTop = "-30px";
      this.animate = !this.animate;
      var that = this; // 在异步函数中会出现this的偏移问题，此处一定要先保存好this的指向
      setTimeout(function() {
        that.items.push(that.items[0]);
        that.items.shift();
        con1.style.marginTop = "0px";
        that.animate = !that.animate; // 这个地方如果不把animate 取反会出现消息回滚的现象，此时把ul 元素的过渡属性取消掉就可以完美实现无缝滚动的效果了
      }, 700);
    },
    mEnter() {
      clearInterval(this.timer2);
    },
    // mLeave2() {
    //   this.timer1 = setInterval(this.scroll, 3000);
    // },
    // mEnter2() {
    //   clearInterval(this.timer1);
    // },
    // 视频监控 - 鼠标移开 .. 电视上这个动作没有用
    mLeave() {
      // this.scroll2()
      let i = 0
      this.timer2 = setInterval(() => {
        i++
        let mar = -0.5 * i + "rem";
        this.scroll2(mar)
      }, 5000);
    },

    scroll2(mar) {

      let con1 = this.$refs.con2;
      // con1.style.marginTop = "-60px";
      
      // this.animate = !this.animate;
      var that = this; // 在异步函数中会出现this的偏移问题，此处一定要先保存好this的指向
      setTimeout(function() {
        let ii = 1
      console.log(ii++)
        
        con1.style.marginTop = mar

        console.log(mar, 'xxxxxxx')
        that.borrowRecordList.push(that.borrowRecordList[0]);
        // that.borrowRecordList.shift();
        // con1.style.marginTop = "0px";
        // that.animate = !that.animate; // 这个地方如果不把animate 取反会出现消息回滚的现象，此时把ul 元素的过渡属性取消掉就可以完美实现无缝滚动的效果了
      }, 2000);
    },

    // 控制右侧文本滚动 - number预警提示 - 上下  number3视频监控
    startMove() {
      console.log('啥是startMove--------------------')
      setTimeout(() => {
        if (this.number === 2) {
          this.number = 0;
        } else {
          this.number += 1;
        }
        this.startMove();
      },10000);
    },
    // 文字左右滚动
    scrollLeft() {
      this.intNum = setInterval(() => {
        this.animate=true;// 向上滚动的时候需要添加css3过渡动画
        setTimeout(()=>{
          this.noticeList.push(this.noticeList[0]);// 将数组的第一个元素添加到数组的
          this.noticeList.shift(); //删除数组的第一个元素
          this.animate=false;
        },500)
      }, 1000);
    },
  },
};
</script>
